<template>
	<view class="container">
		<view class="list">
			<view @click="hanleItemClick(item)" class="item" v-for="(item,index) in list" :key="index" :style="{ backgroundImage: 'url(' + item.url + ')' }">
				<view class="title">{{item.name}}</view>
				<view class="num">**** **** **** **** {{item.cardNo.substring(item.cardNo.length-4)}}</view>
				<view class="tips">可提现、可查询账单</view>
			</view>
		</view>
		<view class="btn" @click="handleClickAdd">
			<u-icon name="plus"></u-icon>
			添加提现账户
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				yebg: this.$mAssetsPath.yebg,
				list: [],
				// {
				// 	name: "中国工商银行储蓄卡",
				// 	url: this.$mAssetsPath.gsyh
				// }, {
				// 	name: "中国建设银行储蓄卡",
				// 	url: this.$mAssetsPath.jsyh
				// }, {
				// 	name: "中国农业银行储蓄卡",
				// 	url: this.$mAssetsPath.nyyh
				// }, {
				// 	name: "中国浦发银行储蓄卡",
				// 	url: this.$mAssetsPath.pfyh
				// }, {
				// 	name: "中国招商银行储蓄卡",
				// 	url: this.$mAssetsPath.
				// }
			}
		},
		onShow() {
			console.log(this.list)
			this.getList();
		},
		methods: {
			hanleItemClick(item) {
				let pages = getCurrentPages(); //获取所有页面栈实例列表
				let nowPage = pages[pages.length - 1]; //当前页页面实例
				let prevPage = pages[pages.length - 2]; //上一页页面实例
				// #ifdef APP-PLUS				
				prevPage.$vm.cardInfo = item;
				// #endif
				uni.navigateBack({
					delta: 1
				});
			},
			async getList() {
				let that = this;
				let data = await this.$apis.bankAccounts();
				if (data.code === 200) {
					this.list = data.data;
					console.log(this.list)
					this.list.forEach(function(item) {
						item.url = that.$mAssetsPath[item.code]
					})
				}
			},
			handleClickAdd() {
				this.$mRouter.push({
					route: this.$mRoutesConfig.addAcount
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.container {
		padding: 30upx;

		.btn {
			width: 100%;
			height: 80upx;
			background-color: #AB61FF;
			margin-bottom: 30upx;
			border-radius: 40upx;
			text-align: center;
			line-height: 80upx;
			color: #fff;
			font-size: 32upx;
		}

		.list {
			width: 100%;
			margin-bottom: 150upx;

			.item {
				width: 100%;
				height: 300upx;
				background-size: auto 100%;
				background-repeat: no-repeat;
				margin-bottom: 30upx;
				padding: 47upx 45upx 43upx 45upx;
				color: #fff;

				.title {
					font-size: 36upx;
					height: 36upx;
					line-height: 36upx;
				}

				.num {
					font-size: 32upx;
					margin-top: 100upx;
				}

				.tips {
					font-size: 28upx;
				}
			}
		}
	}
</style>
